﻿//********** HELP TOPICS *************//
var jsonHelp = [
{ "text": "Introduction", "id": "intro.htm", "leaf": false, "cls": "help-node", "children": [
    { "text": "Resources", "id": "resources.htm", "leaf": false, "cls": "topic-container-node", "children":
        [{ "text": "CodePlex", "id": "codeplex.htm", "leaf": true, "cls": "topic-node" },
          { "text": "Email", "id": "email.htm", "leaf": true, "cls": "topic-node" }
        ]
    },
    { "text": "Getting Started", "id": "gettingStarted.htm", "leaf": false, "cls": "topic-container-node", "children":
        [{ "text": "Download ExtREST", "id": "downloadExtRest.htm", "leaf": true, "cls": "topic-node" },
          { "text": "Create ASP.Net Project", "id": "createAspNetProject.htm", "leaf": true, "cls": "topic-node" },
          { "text": "Database Configuration", "id": "dbConfig.htm", "leaf": true, "cls": "topic-node" },
          { "text": "ExtREST", "id": "extRest.htm", "leaf": true, "cls": "topic-node" }
        ]
    }
 ]
}];

//******** HELP ROOT NODE ***********//
var rootHelp = new Ext.tree.TreeNode({
    text: 'ExtRest',
    draggable: false,
    id: 'rootHelp',
    cls: 'help-root-node'
});

//******** TOPIC TABS ***********//
var tabsHelpTopics = {
    xtype: 'tabpanel',
    id: 'card-tabs-panel',
    plain: true,
    activeItem: 0,
    autoWidth: true,
    enableTabScroll: true,
    resizeTabs: true,
    defaults: { autoScroll: true },
    items: [{
        id: 'intro.htm',
        iconCls: 'helpNodeTab',
        title: 'Introduction',
        closable: true,
        autoLoad: { "url": 'help/intro.htm' }
    }]
};

//******** HELP TREE ***********//
var treeHelp = new Ext.tree.TreePanel({
    id: 'tree-panel',
    title: 'Rest Manager Help',
    region: 'center',
    split: true,
    height: 300,
    minSize: 150,
    collapsible: false,
    autoScroll: true,
    rootVisible: false,
    lines: true,
    singleExpand: true,
    useArrows: false,
    loader: new Ext.tree.TreeLoader(),
    root: rootHelp
});

treeHelp.on('click', function(n) {
    var sn = this.selModel.selNode || {};
    if (n.id != sn.id) {
        var tbs = Ext.getCmp('card-tabs-panel');
        var tab = tbs.getItem(n.id);
        if (!tab) {
            tabcls = '';
            switch (n.cls) {
                case 'help-node':
                    tabcls = 'helpNodeTab';
                    break;
                case 'topic-container-node':
                    tabcls = 'helpTopicContainerTab';
                    break;
                default:
                    tabcls = 'helpTopicTab';
            }
            tbs.add({
                title: n.text,
                id: 'helptab-' + n.id,
                closable: true,
                iconCls: tabcls,
                autoLoad: {
                    "url": 'help/' + n.id + '?rnd=' + Math.floor(Math.random()*11), "scripts": true, callback: function(el, success) {
                        if (!success) {
                            Ext.get('helptab-' + n.id).dom.innerHTML = 'Sorry, this help page is missing!';
                        }
                    }
                }
            });
        }
        tbs.setActiveTab('helptab-' + n.id);
    }
});

/* Load the tree with the json data */
for (var i = 0, len = jsonHelp.length; i < len; i++) {
    rootHelp.appendChild(treeHelp.getLoader().createNode(jsonHelp[i]));
}

//******** THE MAIN APP HELP TAB ***********//
var tabHelp = new Ext.Panel({
    layout: 'border',
    iconCls: 'helpNodeTab',
    title: 'Help',
    items: [{
        layout: 'border',
        id: 'layout-browser',
        region: 'west',
        border: false,
        split: true,
        margins: '2 0 5 5',
        width: 175,
        minSize: 100,
        maxSize: 500,
        items: [treeHelp]
    }, {
        split: true,
        id: 'tbpanel',
        region: 'center',
        border: true,
        layout: 'fit',
        items: [
            tabsHelpTopics
        ]
    }]
});